import React from 'react';
import {Provider, observer, inject} from 'mobx-react';
import {withRouter} from 'react-router-dom';
import {toJS} from "mobx";
import { Card, WhiteSpace,Avatar,Tools,Icon } from 'weaver-mobile';
import * as SignUtil from '../../../../workflowForm/util/SignUtil';
import * as CommonUtil from '../../../../workflowForm/util/common';
import base from '../../../../workflowForm/util/base';
import * as AdapterConstant from "../../../../workflowForm/constants/adapter";
const getLabel = Tools.getLocaleLabel;
@inject("signGroupPageStore","odocComsStore")
@observer
export default class OdocComs4Export extends React.Component {
    constructor(props) {
        super(props);
    }

    componentDidMount() {
        window.openlocation = this.openlocation;
    }

    getRemarkCom=(groupDatas)=>{
        let {type} = this.props;
        let {remark,annexdocs=[],signdocs=[],signwfs=[],userimg="",remarkLocation=""} = toJS(groupDatas);
        let {logParams={}} = this.props.signGroupPageStore;
        let {authStr="",authSignatureStr=""} = toJS(logParams);
        const locationInfoData = SignUtil.getLocationInfoData(remarkLocation);
        let baseRoute = "/req";
        if("2"==type){
            baseRoute = "/req/odocComs/odoc_change_odoc_cus_tab"
        }
        return <div>
            <div dangerouslySetInnerHTML={{__html:this.getRemarkHtml(remark,true,true,baseRoute)}}/>
            <div className='remark-content-resource'>
                {
                    annexdocs.length > 0 &&
                    <div className={'remark-content-resource-type'}>
                        <Icon type='enclosure' size={'xxs'}/>
                        <div className="content-rignt-main">
                            {annexdocs.map((d = {}, index) => {
                                const {filelink = '', tempshowname = '', fileExtendName = '', downloadlink = '', docImagefileSize} = d;
                                return <div className={'content-resource-item'}
                                            onClick={() =>{
                                                let fileObj = {
                                                    imagefileid:d.docImagefileid,
                                                    fileExtendName:fileExtendName,
                                                    isPreViewImg:false,
                                                }
                                                CommonUtil.showFormAttach(fileObj,{},baseRoute);
                                            }}
                                            key={`fj_${index}`}>{`${tempshowname}.${fileExtendName}`}</div>
                            })}
                        </div>
                    </div>
                }
                {
                    signdocs.length > 0 &&
                    <div className={'remark-content-resource-type'}>
                        <Icon type='blog-normal' size={'xxs'}/>
                        <div className="content-rignt-main">
                            {signdocs.map((d = {}, index) => {
                                return <div className={'content-resource-item'} key={`doc_${index}`}
                                            onClick={() => {
                                                CommonUtil.showFormDoc(d.showid, {}, baseRoute)
                                            }}>{d['tempshowname']}</div>
                            })}
                        </div>
                    </div>
                }
                {
                    signwfs.length > 0 &&
                    <div className={'remark-content-resource-type'}>
                        <Icon type='process' size={'xxs'}/>
                        <div className="content-rignt-main">
                            {signwfs.map((w = {}, index) => {
                                return <div className={'content-resource-item'} key={`wf_${index}`}
                                            onClick={() => {
                                                CommonUtil.showFormReq(w.requestid, {
                                                    requestid: w.requestid,
                                                    isrequest: w.isrequest
                                                }, baseRoute)
                                            }}>{w['title']}</div>
                            })}
                        </div>
                    </div>
                }
                {Object.keys(locationInfoData).length > 0 &&
                <div className={'remark-content-resource-type'}>
                    <Icon type='location' size={'xxs'}/>
                    <div className="content-rignt-main">
                        <div className={'content-resource-item wf-sign-url'} key={`location`} onClick={() => {
                            this.openlocation(remarkLocation)
                        }}>{locationInfoData.address}</div>
                    </div>
                </div>
                }
            </div>
        </div>
    }

    getRemarkHtml = (log_remarkHtml = '', convertImg=true,calImgWidth=true,baseRoute='/req') => {
        let reg = /href=\"\/spa\/document\/index.jsp\?.*?\"/g;
        let docs = log_remarkHtml.match(reg);
        let remarkHtmlTemp = log_remarkHtml;
        docs && docs.map((item) => {
            if (/\&(amp;){0,1}id=(\d*?)\&/g.test(item)) {
                let docid = RegExp.$2;
                remarkHtmlTemp = remarkHtmlTemp.replace(item, `onclick="window.showFormDoc(${docid},{},'${baseRoute}')"`);
            }
        })
        let reg2 = /href=\"\/workflow\/request\/ViewRequestForwardSPA.jsp.*?\"/g;
        let reqs = log_remarkHtml.match(reg2);
        reqs && reqs.map((v) => {
            if (/\&(amp;){0,1}requestid=(\d*?)\&/g.test(v)) {
                let requestid = RegExp.$2;
                remarkHtmlTemp = remarkHtmlTemp.replace(v, `onclick="window.showFormReq(${requestid},{},'${baseRoute}')"`);
            }
        })

        //跳转人力资源卡片
        let reg3 = /href=\"\/hrm\/HrmTab.jsp\?.*?\"/g;
        let ats = log_remarkHtml.match(reg3);
        ats && ats.map((v) => {
            if (/\&(amp;){0,1}id=(\d*?)\"/g.test(v)) {
                let id = RegExp.$2;
                remarkHtmlTemp = remarkHtmlTemp.replace(v, `onclick="window.showHoverWindow('/spa/hrm/static4mobile/index.html#/resourceInfo/${id}','${baseRoute}')"`);
            }
        })

        if(convertImg){
            let reg4 = /<img.*?(\/>|<\/img>)/g;
            let images = remarkHtmlTemp.match(reg4);
            images && images.map((v) => {
                let oldclass = "";
                if(/class=(\"|\')(.*?)(\"|\')/g.test(v)) {
                    oldclass = RegExp.$2;
                }
                if (oldclass != 'signatureImg') {
                    //为img添加同一处理
                    if(calImgWidth){
                        let _v = v.replace(/<img/g, `<img onload='window.signImgResize(this)' onClick='window.signPreViewImg(this)' img-key="signlist" class='formImgPlay ${oldclass}'`);
                        remarkHtmlTemp = remarkHtmlTemp.replace(v, _v);
                    }else{
                        let _v = v.replace(/<img/g, `<img onClick='window.signPreViewImg(this)' img-key="signlist" class='formImgPlay ${oldclass}'`);
                        remarkHtmlTemp = remarkHtmlTemp.replace(v, _v);
                    }
                }
            })
        }

        //附件上传字段  <a\s+href="(.*)"\s+title="(.*)"\s*>(.*)<\s*/a>
        let reg5 =  /href=\"javascript[:]void[(]0[)]\;\"\s+onclick=\"(parent.openFullWindowHaveBar)[(]\'\/spa\/document\/index.jsp\?.*?[)]\"/g;
        let files = remarkHtmlTemp.match(reg5);
        files && files.map((item) => {
            if (/\&(amp;){0,1}id=(\d*?)\&/g.test(item)) {
                let docid = RegExp.$2;
                remarkHtmlTemp = remarkHtmlTemp.replace(item, `onclick="window.showFormDoc(${docid},{},'${baseRoute}')"`);
            }
        })

        //超链接
        let reg6 = /href=(\"([^<>"\']*)\"|\'([^<>"\']*)\')/gi;
        let a_links = remarkHtmlTemp.match(reg6);
        a_links&&a_links.map(item=>{
            if(/\"([^<>"\']*)\"|\'([^<>"\']*)\'/g.test(item)){
                let url = RegExp.$1 || RegExp.$2;
                remarkHtmlTemp = remarkHtmlTemp.replace(item, `onclick="window.showHoverWindow('${url}','${baseRoute}')"`);
            }
        })

        //表单内签字意见中的附件、文档
        let reg7 = /onclick=\"addDocReadTag[(][0-9]*[)]\;openFullWindowHaveBar[(](\'\/spa\/document\/index.jsp\?.*?\')[)]\"/g;
        let remark_docs = remarkHtmlTemp.match(reg7);
        remark_docs && remark_docs.map(item=>{
            if (/id=(\d*?)\&/g.test(item)) {
                let docid = RegExp.$1;
                remarkHtmlTemp = remarkHtmlTemp.replace(item, `onclick="window.showFormDoc(${docid},{},'${baseRoute}')"`);
            }
        })
        //表单内签字意见中的流程
        let reg8 = /onclick=\"openFullWindowHaveBar[(](\'\/workflow\/request\/ViewRequestForwardSPA.jsp.*?\')[)]\"/g;
        let remark_reqs = remarkHtmlTemp.match(reg8);
        remark_reqs && remark_reqs.map((v) => {
            if (/requestid=(\d*?)\&/g.test(v)) {
                let requestid = RegExp.$1;
                remarkHtmlTemp = remarkHtmlTemp.replace(v, `onclick="window.showFormReq(${requestid},{},'${baseRoute}')"`);
            }
        })

        //remarkHtmlTemp = convertSpecialChar(remarkHtmlTemp,true);
        return remarkHtmlTemp;
    }

    //打开位置
    openlocation=(remarkLocation = '')=> { //与pc端统一调用传参为str
        const locationInfoData = SignUtil.getLocationInfoData(remarkLocation);
        const {Adapter} = base.allStores.wfSignInputStore;
        if (Adapter && Adapter.judgeApiSupport(AdapterConstant.API_OPEN_LOCATION)) {
            Adapter.openLocation(locationInfoData);
        }
    }

    //签章数据
    getUserImg=(itemData)=> {
        const {qys_signature_id = "", userimg="", signnaturImgHeight,qyswidth = 0,qysheight = 0} = itemData;
        let imgstyle = {};
        if( qyswidth> 0 && qysheight > 0){
            imgstyle.width = qyswidth;
            imgstyle.height = qysheight;
        }
        const maxHeightStyle= signnaturImgHeight == -1 ? 'none' : signnaturImgHeight+'px';
        if (qys_signature_id && qys_signature_id!="") {
            return (
                <div className="content-right-userimg">
                    <img src={`/weaver/weaver.file.FileDownload?fileid=${qys_signature_id}`}   {...imgstyle} />
                </div>
            );
        }else if (userimg && userimg!="") {
            return (
                <div className="content-right-userimg">
                    <img style={{'maxHeight': `${maxHeightStyle}`}} id="markImg" src={userimg}></img>
                </div>
            );
        } else {
            return <div></div>;
        }
    }

    getRemarkRelateComp=(groupDatas,groupColumn)=>{
        return <div className={"remark-content-relative"}>{
            groupColumn.map(item=>{
                let key =item.key;
                if(key!="remark" && key!="operator" && key!="operatordept"){
                    return <div>{item.title}：{groupDatas[key]}</div>
                }
            })
        }</div>;
    }

    render() {
        let {signGroupPageStore,groupDatas,groupColumn,type} = this.props;
        let {tabPage,tabs} = this.props.signGroupPageStore;
        let {operatorid="",operator="",operatordept=""} = groupDatas;
        groupColumn = toJS(groupColumn);
        return (
            <Card full>
                <Card.Header
                    title={<div className={"wea-sign-card-header"}>
                        <div className={"operator"} onClick={() => {
                            if(type==1){
                                CommonUtil.formOpenHrmCard(operatorid)
                            }else {
                                let url = `/spa/hrm/static4mobile/index.html#/resourceInfo/${operatorid}`;
                                CommonUtil.showHoverWindow(url,"/req/odocComs/odoc_change_odoc_cus_tab");
                            }

                        }}>{operator}</div>
                        {operatordept!="" && <div className={"department"}>{operatordept}</div>}</div>}
                    thumb={<Avatar userId = {operatorid} />}
                />
                <Card.Body>
                    <div>{this.getRemarkCom(groupDatas)}</div>
                    <div>{this.getUserImg(groupDatas)}</div>
                </Card.Body>
                <Card.Footer content={this.getRemarkRelateComp(groupDatas,groupColumn)}  />
            </Card>
        );
    }
}